import { Box, Typography } from "@mui/material";
import { useNavigate } from "react-router-dom";

export const UserCard = ({ name, username, s }) => {
  const navigate = useNavigate();

  return (
    <Box
      className={s.search__result__card}
      onClick={() => navigate(`/users/${name}`)}
    >
      <Typography className={s.search__result__card__name}>{name}</Typography>
      <Typography className={s.search__result__card__username}>
        {username}
      </Typography>
    </Box>
  );
};
